{% extends "mdm/basemdm.html" %}

{% block title %} {{ titulo }} {% endblock %}


{% block contenido %}
     <div id="contenido">
          <div id="izq">
               <div id="promociones">
                    {% for promo in promos  %}
                        <div  id="divpromo_{{ promo.id }}">
                              <h3 id="promo{{ promo.id }}"><a href="#">{{ promo.nombre }}</a></h3>
                         </div>
                    {% endfor %}
               </div>
          </div>
          <div id="der" class="sombra ui-accordion-header ui-helper-reset ui-state-active ui-corner-all"></div>
     </div>

{% endblock  %}

{% block script %}
     <script>
     var actual = ''
     $(
          function() {

               $( "#promociones h3" ).click(
                    function( event ) {
                         cargaPromo($(this).attr('id'))
                    }
               )

               $( "#promociones" ).accordion(
                    {
                         header: '> div > h3',
                         icons: { 'header': 'ui-icon-triangle-1-e', 'headerSelected': 'ui-icon-circle-triangle-e' }
                    }
               )
               
               $( '#publicada, #pub_comentario' ).on(
                    'click',
                    function( event ) {
                         espera()
                         $.post(
                              '{% url "modencuesta" %}',
                              {'campo': $(this).attr('id'), 'encuesta': $(this).attr('rel'), 'valor': ($(this).attr('checked') ? 1 :  0) }
                         )
                    }
               )
               
               $(document).ajaxStop($.unblockUI)      
               setTimeout("cargaPromo($('#promociones div h3').attr('id'))", 500)
          }
     )
     
     function cargaPromo(id){
          espera()
          $.post(
               '{% url "encuestas_promo" %}' + '/' + id.replace('promo', ''), 
               '',
               function(data){
                   rellenar(data)
               },
               'json'
          )
          if (actual) $('#' + actual).parent().removeClass('sombra')
          $('#' + id).parent().addClass('sombra')
          actual = id
     }
          
     function rellenar(dat) {
          $('#der').empty()
          for (x in dat) {
               $('#der').append(dat[x].tabla)
          }
     }
       
     function espera() {
          $.blockUI({message: '<h3><img src="{{ STATIC_URL }}img/superbgloading.gif" style="vertical-align: middle; margin: 5px">Espere, por favor...</h3>'})
     }
     
     </script>
{% endblock  %}
